/*
 * Copyright 2021 ThoughtWorks, Inc.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
/* rounded corner (use luke's trick) */
.ab-bg {background-color: transparent; clear: both;
display: none;}
.ab-corner {
    border-style: solid;
    border-color: #e7e1d1;
    background-color: transparent;
    display: block;
    font-size: 0;
    margin-left: 0px;
    margin-right: 0px;
    width: auto;
    overflow: hidden;
}

.lvl1 {border-width: 0px 5px; height: 1px; }
.lvl2 {border-width: 0px 3px; height: 1px; }
.lvl3 {border-width: 0px 2px; height: 1px; }
.lvl4 {border-width: 0px 1px; height: 1px; }

/* float rounded corner container, with white background */
.f-r-corner {
    background: #99cc66;
    margin: 1em;
    padding: 0.3em;
    float: left;
    position: relative;
}
.f-r-corner b, .rounded-corner-grey-border .f-r-corner b {
    display: block;
    height: 6px;
    width: 6px;
    line-height: 0;
    font-size: 0;
    position: absolute;
}
.f-r-corner .c1, .rounded-corner-grey-border .f-r-corner .c1 {
    background: transparent image_url('trans_rc_white_lt.png') no-repeat left top;
    *background: none;
    behavior: url(iepngfix.htc);
    left: 0;
    top: 0;
}
.f-r-corner .c2, .rounded-corner-grey-border .f-r-corner .c2 {
    background: transparent image_url('trans_rc_white_rt.png') no-repeat left top;
    *background: none;
    behavior: url(iepngfix.htc);
    right: 0;
    *right: -1px;
    top: 0;
}
.f-r-corner .c3, .rounded-corner-grey-border .f-r-corner .c3 {
    background: transparent image_url('trans_rc_white_lb.png') no-repeat left top;
    *background: none;
    behavior: url(iepngfix.htc);
    left: 0;
    bottom: 0;
    *bottom: -1px;
}
.f-r-corner .c4, .rounded-corner-grey-border .f-r-corner .c4 {
    background: transparent image_url('trans_rc_white_rb.png') no-repeat left top;
    *background: none;
    behavior: url(iepngfix.htc);
    right: 0;
    *right: -1px;
    bottom: 0;
    *bottom: -1px;
}

/* float rounded corner container, with grey(#EEEEEE) background, and use css sprites cominbe all the bg image in on file */
.rounded-corner-borderless {
    background-color: #EEE;
    margin: 1em;
    padding: 0.3em;
    float: left;
    position: relative;
}
.rounded-corner-borderless b {
    display: block;
    height: 4px;
    width: 5px;
    background-image: image_url('bg-rounded-corner-eee.gif');
    background-repeat: no-repeat;
    line-height: 0;
    font-size: 0;
    position: absolute;
    overflow: hidden;
}
.rounded-corner-borderless .c1 {
    left: 0;
    top: 0;
    background-position: 0 0;
}
.rounded-corner-borderless .c2 {
    right: 0;
    top: 0;
    background-position: -5px 0;
}
.rounded-corner-borderless .c3 {
    left: 0;
    bottom: 0;
    background-position: 0 -4px;
}
.rounded-corner-borderless .c4 {
    right: 0;
    bottom: 0;
    background-position: -5px -4px;
}

/* float rounded corner container, with white background and grey border */
.rounded-corner-grey-border,
.rounded-corner-for-body,
.rounded-corner-for-pipeline,
.rounded-corner-for-pipe-conf,
.rounded-corner-for-pipe-conf-stage,
.rounded-corner-for-tab-container {
    background: #FFFFFF;
    /*margin: 1em;*/
    padding: 0.3em;
    position: relative;
    overflow: visible;
    zoom: 1;
}

.rounded-corner-grey-border b,
.rounded-corner-for-body b,
.rounded-corner-for-pipeline b,
.rounded-corner-for-pipe-conf b,
.rounded-corner-for-pipe-conf-stage b
{
    display: block;
    line-height: 0;
    font-size: 0;
    position: absolute;
    overflow: hidden;
}

.rounded-corner-for-body {
    background: #e7e1d1;
    padding: 0;
}

.rounded-corner-for-pipeline {
    /*border: 1px solid #938b55;*/
}

.rounded-corner-for-pipe-conf {
    border: 1px solid #584538;
}

.rounded-corner-for-pipe-conf-stage {
    border: 1px solid #B08B71;
}

.rounded-corner-for-tab-container {

}

.rounded-corner-for-body b
{
    width: 9px;
    height: 9px;
}

.rounded-corner-for-pipeline b {
    width: 10px;
    height: 12px;
}

.rounded-corner-for-pipe-conf b {
    width: 11px;
    height: 11px;
    _display: none;
}

.rounded-corner-for-pipe-conf-stage b {
    width: 7px;
    height: 7px;
}

.rounded-corner-for-tab-container b {
    width: 5px;
    height: 5px;
}

.rounded-corner-for-body .c1 {
    background: transparent image_url('bg_body_corner.png') no-repeat left top;
    left: -1px;
    top: -1px;
}

.rounded-corner-for-body .c2 {
    background: transparent image_url('bg_body_corner.png') no-repeat right top;
    right: -1px;
    top: -1px;
}

.rounded-corner-for-body .c3 {
    background: transparent image_url('bg_body_corner.png') no-repeat left bottom;
    left: -1px;
    bottom: -1px;
    _display: none;
}

.rounded-corner-for-body .c4 {
    background: transparent image_url('bg_body_corner.png') no-repeat right bottom;
    right: -1px;
    bottom: -1px;
    _display: none;
}

.rounded-corner-for-pipeline .c1 {
    background: transparent image_url('bg_pipeline_corner.png') no-repeat left top;
    left: -1px;
    top: -1px;
}

.rounded-corner-for-pipeline .c2 {
    background: transparent image_url('bg_pipeline_corner.png') no-repeat right top;
    right: -1px;
    top: -1px;
    _display: none;
}

.rounded-corner-for-pipeline .c3 {
    background: transparent image_url('bg_pipeline_corner.png') no-repeat left bottom;
    left: -1px;
    bottom: -1px;
    _display: none;
}

.rounded-corner-for-pipeline .c4 {
    background: transparent image_url('bg_pipeline_corner.png') no-repeat right bottom;
    right: -1px;
    bottom: -1px;
    _display: none;
}

.rounded-corner-for-pipe-conf .c1 {
    background: transparent image_url('bg_pipeline_config_corners.png') no-repeat left top;
    left: -1px;
    top: -1px;
}

.rounded-corner-for-pipe-conf .c2 {
    background: transparent image_url('bg_pipeline_config_corners.png') no-repeat right top;
    right: -1px;
    top: -1px;
}

.rounded-corner-for-pipe-conf .c3 {
    background: transparent image_url('bg_pipeline_config_corners.png') no-repeat left bottom;
    left: -1px;
    bottom: -1px;
}

.rounded-corner-for-pipe-conf .c4 {
    background: transparent image_url('bg_pipeline_config_corners.png') no-repeat right bottom;
    right: -1px;
    bottom: -1px;
}

.rounded-corner-for-pipe-conf-stage .c1 {
    background: transparent image_url('bg_pipeline_config_stage_corner.png') no-repeat left top;
    left: -1px;
    top: -1px;
}

.rounded-corner-for-pipe-conf-stage .c2 {
    background: transparent image_url('bg_pipeline_config_stage_corner.png') no-repeat right top;
    right: -1px;
    top: -1px;
}

.rounded-corner-for-pipe-conf-stage .c3 {
    background: transparent image_url('bg_pipeline_config_stage_corner.png') no-repeat left bottom;
    left: -1px;
    bottom: -1px;
}

.rounded-corner-for-pipe-conf-stage .c4 {
    background: transparent image_url('bg_pipeline_config_stage_corner.png') no-repeat right bottom;
    right: -1px;
    bottom: -1px;
}
.rounded-corner-for-tab-container .c1 {
    background: transparent image_url('bg_tab_container_corner.png') no-repeat left top;
    left: -1px;
    top: -1px;
}

.rounded-corner-for-tab-container .c2 {
    background: transparent image_url('bg_tab_container_corner.png') no-repeat right top;
    right: -1px;
    top: -1px;
}

.rounded-corner-for-tab-container .c3 {
    background: transparent image_url('bg_tab_container_corner.png') no-repeat left bottom;
    left: -1px;
    bottom: -1px;
}

.rounded-corner-for-tab-container .c4 {
    background: transparent image_url('bg_tab_container_corner.png') no-repeat right bottom;
    right: -1px;
    bottom: -1px;
}

/* Make sure this container's style not be overwrited by other rule */
.rounded-corner-grey-border {
    /*border: 1px solid #929292;*/
}

.rounded-corner-grey-border b {
    width: 7px;
    height: 7px;
}

.rounded-corner-grey-border .c1 {
    background: transparent image_url('bg_pipeline_history_corner.png') no-repeat left top;
    *background: none;
    behavior: url(iepngfix.htc);
    left: -1px;
    top: -1px;
}
.rounded-corner-grey-border .c2 {
    background: transparent image_url('bg_pipeline_history_corner.png') no-repeat right top;
    *background: none;
    behavior: url(iepngfix.htc);
    right: -1px;
    *right: -2px;
    top: -1px;
}
.rounded-corner-grey-border .c3 {
    background: transparent image_url('bg_pipeline_history_corner.png') no-repeat left bottom;
    *background: none;
    behavior: url(iepngfix.htc);
    left: -1px;
    bottom: -1px;
}
.rounded-corner-grey-border .c4 {
    background: transparent image_url('bg_pipeline_history_corner.png') no-repeat right bottom;
    *background: none;
    behavior: url(iepngfix.htc);
    right: -1px;
    *right: -2px;
    bottom: -1px;
}
